<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('修改订票订单信息')" />
    <th:block th:include="include :: datetimepicker-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-ticketorder-edit" th:object="${ticketOrder}">
            <input name="id" th:field="*{id}" type="hidden">
            <div class="form-group">    
                <label class="col-sm-3 control-label">订单时间：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="orderTime" th:value="${#dates.format(ticketOrder.orderTime, 'yyyy-MM-dd')}" class="form-control" placeholder="yyyy-MM-dd" type="text">
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">订票人识别：</label>
                <div class="col-sm-8">
                    <input name="orderName" th:field="*{orderName}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">订票场次(show_time主键)：</label>
                <div class="col-sm-8">
                    <input name="showTimeId" th:field="*{showTimeId}"  class="form-control" type="text" style="display:none;">
                    <select class="form-control" name="showTimeIdselect">
                        <option value="0">请选择场次</option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">订票张数：</label>
                <div class="col-sm-8">
                    <input name="ticketCount" th:field="*{ticketCount}" class="form-control" type="text" required>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">订票座位号：</label>
                <div class="col-sm-8">
                    <input name="seatId" th:field="*{seatId}" class="form-control" type="text" required>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">电影ID：</label>
                <div class="col-sm-8">
                    <input name="movieId" th:field="*{movieId}" class="form-control" type="text" readonly>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">电影名：</label>
                <div class="col-sm-8">
                    <input name="movieName" th:field="*{movieName}" class="form-control" type="text" readonly>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">实际看电影时间：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="watchTime" th:value="${#dates.format(ticketOrder.watchTime, 'yyyy-MM-dd')}" class="form-control" placeholder="yyyy-MM-dd" type="text">
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">电影票价：</label>
                <div class="col-sm-8">
                    <input name="price" th:field="*{price}" class="form-control" type="text" readonly>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">实付价格：</label>
                <div class="col-sm-8">
                    <input name="payPrice" th:field="*{payPrice}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group" style="display: none;">
                <label class="col-sm-3 control-label">是否删除作废，0否，1删除：</label>
                <div class="col-sm-8">
                    <input name="isDel" th:field="*{isDel}" class="form-control" type="text">
                </div>
            </div>
<!--            <div class="form-group" >    -->
<!--                <label class="col-sm-3 control-label">操作者Id：</label>-->
<!--                <div class="col-sm-8">-->
<!--                    <input name="operateId" th:field="*{operateId}" class="form-control" type="text">-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="form-group">    -->
<!--                <label class="col-sm-3 control-label">操作者用户名：</label>-->
<!--                <div class="col-sm-8">-->
<!--                    <input name="operateName" th:field="*{operateName}" class="form-control" type="text">-->
<!--                </div>-->
<!--            </div>-->
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: datetimepicker-js" />
    <script th:inline="javascript">
        var prefix = ctx + "system/ticketorder";
        $("#form-ticketorder-edit").validate({
            focusCleanup: true
        });

        function submitHandler() {
            if ($.validate.form()) {


                if( 0 == $('select[name=showTimeIdselect]').val())
                {
                    $.modal.alert('电影场次不能为空，请选择电影场次');
                    return;
                }
                var dataObjTemp = $('#form-ticketorder-add').serialize();
                console.log("添加订单=" + dataObjTemp +",data="+unescape(dataObjTemp));

                //处理 showTimeId
                console.log("showmovieId="+$('select[name=showTimeIdselect]').val());

                var obj = JSON.parse($('select[name=showTimeIdselect]').val());
                console.log("obj="+obj);
                console.log("dataObj.showTimeIdselect="+obj.id);
                // var showTimeId = JSON.parse(dataObj.showTimeId);
                // dataObj.showTimeId = showTimeId.id;
                $('input[name=showTimeId]').val(obj.id+"");


                var dataObj = $('#form-ticketorder-edit').serialize();
                dataObj += "&showTimeId="+ obj.id;

                console.log("修改后的showtimeId="+ $('select[name=showTimeId]').val() );
                console.log("修改订单=" + dataObj
                    +",data="+unescape(dataObj)
                    +",movieName="+dataObj.movieName);


                $.operate.save(prefix + "/edit", dataObj);
            }
        }

        $("input[name='orderTime']").datetimepicker({
            format: "yyyy-mm-dd",
            minView: "month",
            autoclose: true
        });

        $("input[name='watchTime']").datetimepicker({
            format: "yyyy-mm-dd",
            minView: "month",
            autoclose: true
        });

        //页面初始化，初始化电影场次
        $.get(ctx + 'system/movieshowtime/getShowTimeList', null, function(data){//param为参数---键值对方式
            $.each(data.array, function(i,item){
                var showStr = "电影["+item.movieName+"],日期["+item.playDate+"],时间["+item.playTime+"]";
                // console.log("遍历信息="+showStr+",item="+JSON.stringify(item) +",电影票="+ $('input[name=showTimeId]').val());
                $("select[name=showTimeIdselect]").append("<option value='"+JSON.stringify(item)+"'>"+showStr+"</option>");

                //找到当前的电影场次并选中
                if($('input[name=showTimeId]').val() == item.id)
                {
                    $("select[name=showTimeIdselect]").val(JSON.stringify(item));
                }
            });
        });

        $('select[name=showTimeIdselect]').on('change',function(){
            var val = $(this).val();
            console.log("此时val="+val+"@");
            if("0" == val)
            {
                // $("input[name=movieId]").val(0);
                $("input[name=movieName]").val("");
                $("input[name=price]").val("");
                $("input[name=payPrice]").val("");
                return;
            }
            var item = JSON.parse(val);
            // console.log('请求服务端数据' + item+",                 str2="+JSON.stringify(item));   //控制台输出
            // $(this).blur();
            //yanruTODO 点击某个场次之后进行回调
            $("input[name=movieId]").val(item.movieId);
            $("input[name=movieName]").val(item.movieName);
            $("input[name=price]").val(item.price);
            $("input[name=payPrice]").val(item.price);
        }).on('focus',function(){
            // $(this).val(-1);
            console.log("此时数据focus");
        })




    </script>
</body>
</html>